// import buildingMgr from '@/biz/building/index.js'
import server from '@/config/server/index.js'
import ruleOpt from './rule.js'
import { reactive } from 'vue'
let api = {
  getAreacodePropertyList: () => {
    return server.api().post('/sa-admin/api/v1/baseCity/cityPage')
  },
  getStreetList: () => {
    return server.api().get('/hft-portal/v1/city/street/list')
  }
}
function listByCityId(params) {
  return api
    .getAreacodePropertyList()
    .fetch(params)
    .then((res) => {
      console.log(res.list, 'vbbb')
      return res.list.map((item) => {
        item.key = item.cityCode.toString()
        item.value = item.cityName
        return item
      })
    })
}

function getStreetList(params) {
  return api
    .getStreetList()
    .fetch(params)
    .then((res) => {
      return res.map((item) => {
        item.key = item.streetCode.toString()
        item.value = item.streetName
        return item
      })
    })
}

// 省市联动 层级(1:国 2:省 3:市 4:区,5:街道)
function getareaCodeList(level = 2, parentCode = '', city = '') {
  console.log(level, 'ddded')
  let params = {
    page: '1',
    rows: '50',
    level: level,
    parentCode: parentCode
  }
  if (level == 5) {
    params.cityCode = level == 5 ? parentCode : ''
    return getStreetList(params).then((res) => {
      return res
    })
  } else {
    return listByCityId(params).then((res) => {
      return res
    })
  }
}

function rulesCity(msg, ok) {
  let validator = (rule, value, callback) => {
    if (ok(value)) {
      return callback(msg)
    }
    callback()
  }
  return {
    validator,
    trigger: 'blur,change'
  }
}

function city(opt) {
  console.log(opt.info, '城市信息')
  let province = {
    key: 'provinceCode',
    col: 6,
    placeholder: '请选择省',
    disabled: opt.isView,
    load: (o) => {
      getareaCodeList().then((res) => {
        o.select.options = res
      })
    },
    select: {
      options: []
    },
    change: (data) => {
      console.log(data, 'provinceCode')
      data.info.provinceName = data.editValue ? data.editValue.label : ''
      street.select.options = []
      data.info.streetCode = ''
      data.info.streetName = ''
      getareaCodeList(3, data.value).then((res) => {
        city.select.options = res
      })
    }
  }
  let city = {
    key: 'cityCode',
    col: 6,
    placeholder: '请选择市',
    disabled: opt.isView,
    load: (o) => {
      if (opt.info.provinceCode) {
        getareaCodeList(3, opt.info.provinceCode).then((res) => {
          o.select.options = res
          if (opt.info.areaCode && opt.info.cityCode) {
            getareaCodeList(5, opt.info.areaCode, opt.info.cityCode).then((res) => {
              street.select.options = res
            })
          }
        })
      }
    },
    select: {
      options: []
    },
    change: (data) => {
      console.log(data, 'cityCode')
      data.info.cityName = data.editValue ? data.editValue.label : ''
      street.select.options = []
      data.info.streetCode = ''
      data.info.streetName = ''
      getareaCodeList(4, data.value).then((res) => {
        area.select.options = res
      })
    }
  }
  let area = {
    key: 'areaCode',
    col: 6,
    placeholder: '请选择区',
    disabled: opt.isView,
    load: (o) => {
      if (opt.info.cityCode) {
        getareaCodeList(4, opt.info.cityCode).then((res) => {
          o.select.options = res
        })
      }
    },
    select: {
      options: []
    },
    change: (data) => {
      console.log(data, 'areaCode')
      data.info.areaName = data.editValue ? data.editValue.label : ''
      getareaCodeList(5, data.value, data.info.cityCode).then((res) => {
        street.select.options = res
      })
    }
  }
  let street = {
    key: 'streetCode',
    col: 6,
    placeholder: '请选择街道',
    disabled: opt.isView,
    load: (o) => {
      if (opt.info.areaCode) {
        getareaCodeList(5, opt.info.areaCode, opt.info.cityCode).then((res) => {
          o.select.options = res
        })
      }
    },
    select: {
      options: [],
      clearable: true
    },
    change: (data) => {
      console.log(data, 'streetCode')
      data.info.streetName = data.editValue ? data.editValue.label : ''
    }
  }

  function group() {
    return [province, city, area, street]
  }
  let option = {
    title: '所属城市',
    key: 'provinceCode',

    col: opt.col || 24,
    group: group(),
    rules: [
      ruleOpt.required('所属城市不能为空'),
      rulesCity('请选择所属城市', (value) => {
        if (opt.checkLevel == 'level1') {
          let flag = true
          flag = opt.info.provinceCode == null || opt.info.provinceCode == ''
          return flag
        } else {
          let flag = true
          flag =
            opt.info.provinceCode == null ||
            opt.info.provinceCode == '' ||
            opt.info.cityCode == null ||
            opt.info.cityCode == '' ||
            opt.info.areaCode == null ||
            opt.info.areaCode == ''
          // || opt.info.streetCode == null || opt.info.streetCode == ''
          return flag
        }
      })
    ]
  }

  // if (opt.visible !== '') {
  //   option.visible = opt.visible

  // }

  return option
}

let cityCascaderList = []
function cityCascader(opt, showLevel = 4) {
  console.log(showLevel, 'showLevel')
  return reactive({
    title: opt.title || '所属城市',
    placeholder: opt.placeholder || '请选择所属城市',
    key: opt.key,
    disabled: opt.disabled,
    visible: opt.visible,
    col: opt.col || 24,
    load: (o) => {
      if (cityCascaderList.length == 0) {
        getareaCodeList().then((res) => {
          console.log(res, 'bbbb')
          res.forEach((item) => {
            item.value = item.key
            item.label = item.cityName
            item.children = []
            item.loading = false
          })
          cityCascaderList = res
          o.cascader.options = cityCascaderList
        })
      } else {
        o.cascader.options = cityCascaderList
      }
    },
    cascader: {
      options: [],
      changeOnSelect: opt.changeOnSelect,
      transfer: false,
      loadData(item, callback) {
        item.loading = true
        getareaCodeList(item.level + 1, item.value, item.parentCode).then((res) => {
          res.forEach((itemL) => {
            itemL.value = itemL.level == 5 ? itemL.streetCode : itemL.cityCode
            itemL.label = itemL.level == 5 ? itemL.streetName : itemL.cityName
            if (itemL.level != showLevel) {
              itemL.children = []
              itemL.loading = false
            }
            item.children.push(itemL)
          })
          item.loading = false
          callback()
        })
      }
    },
    change: opt.change,
    rules: opt.rules || [],
    data: opt.data
  })
}
export default {
  city,
  cityCascader
}
